import 'package:easy_chat_app/commons/utils/RouteUtils.dart';
import 'package:easy_chat_app/mobile/constants/MobileAppGlobalConstants.dart';
import 'package:easy_chat_app/mobile/page/MobileContactsPage.dart';
import 'package:easy_chat_app/mobile/page/MobileMessagePage.dart';
import 'package:easy_chat_app/mobile/page/MobilePersonalCenterPage.dart';
import 'package:flutter/material.dart';
import 'package:logger/logger.dart';
import 'package:provider/provider.dart';

class MobileHomePageDataChangeNotifier extends ChangeNotifier {
  int _currentIndex = 0;

  int get currentIndex => _currentIndex;

  set currentIndex(int value) {
    _currentIndex = value;
    notifyListeners();
  }
}

class MobileHomePage extends StatelessWidget {
  final Logger logger = Logger();

  MobileHomePage({super.key});

  @override
  Widget build(BuildContext context) {
    return MultiProvider(
      providers: [
        ChangeNotifierProvider(create: (context) {
          return MobileHomePageDataChangeNotifier();
        })
      ],
      builder: (context, child) {
        var mobileHomePageDataChangeNotifier =
            context.watch<MobileHomePageDataChangeNotifier>();
        return Scaffold(
          appBar: appbar(mobileHomePageDataChangeNotifier.currentIndex),
          body: body(mobileHomePageDataChangeNotifier.currentIndex),
          bottomNavigationBar: Theme(
              data: ThemeData(
                  brightness: Brightness.light,
                  splashColor: Colors.transparent,
                  highlightColor: Colors.transparent),
              child: BottomNavigationBar(
                  currentIndex: mobileHomePageDataChangeNotifier.currentIndex,
                  backgroundColor: Colors.white,
                  unselectedItemColor: Colors.black,
                  selectedItemColor: Colors.black,
                  onTap: (index) {
                    mobileHomePageDataChangeNotifier.currentIndex = index;
                  },
                  items: const [
                    BottomNavigationBarItem(
                        icon: ImageIcon(
                            AssetImage("images/xiaoxi_unselected.png")),
                        activeIcon:
                            ImageIcon(AssetImage("images/xiaoxi_selected.png")),
                        label: "消息"),
                    BottomNavigationBarItem(
                        icon: ImageIcon(
                            AssetImage("images/lianxiren_unselected.png")),
                        activeIcon: ImageIcon(
                            AssetImage("images/lianxiren_selected.png")),
                        label: "通讯录"),
                    BottomNavigationBarItem(
                        icon: ImageIcon(AssetImage("images/my_unselected.png")),
                        activeIcon:
                            ImageIcon(AssetImage("images/my_selected.png")),
                        label: "我的"),
                  ])),
        );
      },
    );
  }

  Widget body(int currentIndex) {
    if (currentIndex == 0) {
      return MobileMessagePage();
    }
    if (currentIndex == 1) {
      return MobileContactsPage();
    }
    if (currentIndex == 2) {
      return MobilePersonalCenterPage();
    }
    return const Text("页面异常");
  }

  AppBar? appbar(int currentIndex) {
    if (currentIndex == 0) {
      return messagePageAppBar();
    }
    if (currentIndex == 1) {
      return AppBar(
        elevation: 0,
        title: const Text("通讯录"),
        centerTitle: true,
        surfaceTintColor: MobileAppGlobalConstants.appBarSurfaceTintColor,
        backgroundColor: MobileAppGlobalConstants.appBarBackgroundColor,
      );
    }
    if (currentIndex == 2) {
      return AppBar(
        title: const Text("个人中心"),
        centerTitle: true,
        surfaceTintColor: MobileAppGlobalConstants.appBarSurfaceTintColor,
        backgroundColor: MobileAppGlobalConstants.appBarBackgroundColor,
      );
    }
    return AppBar(
      title: const Text("EasyChat"),
      centerTitle: true,
      surfaceTintColor: MobileAppGlobalConstants.appBarSurfaceTintColor,
      backgroundColor: MobileAppGlobalConstants.appBarBackgroundColor,
    );
  }

  AppBar messagePageAppBar() {
    return AppBar(
      title: const Text("消息"),
      centerTitle: true,
      surfaceTintColor: MobileAppGlobalConstants.appBarSurfaceTintColor,
      backgroundColor: MobileAppGlobalConstants.appBarBackgroundColor,
      actions: [
        PopupMenuButton(
            icon: const Icon(Icons.add_circle_outline),
            color: const Color.fromRGBO(75, 75, 75, 1),
            position: PopupMenuPosition.under,
            itemBuilder: (context) {
              return <PopupMenuEntry>[
                PopupMenuItem(
                  child: const Row(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisSize: MainAxisSize.min,
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      Icon(
                        Icons.chat_bubble,
                        color: Colors.white,
                      ),
                      SizedBox(
                        width: 10,
                      ),
                      Text(
                        "发起群聊",
                        style: TextStyle(color: Colors.white, fontSize: 16),
                      )
                    ],
                  ),
                  onTap: () async {
                    await RouteUtils.route2MobileCreateGroupChatPage();
                  },
                ),
                PopupMenuItem(
                  child: const Row(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisSize: MainAxisSize.min,
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      Icon(
                        Icons.add_reaction,
                        color: Colors.white,
                      ),
                      SizedBox(
                        width: 10,
                      ),
                      Text(
                        "添加好友",
                        style: TextStyle(color: Colors.white, fontSize: 16),
                      )
                    ],
                  ),
                  onTap: () async {
                    await RouteUtils.route2MobileAddFriendPage();
                  },
                ),
                PopupMenuItem(
                  child: const Row(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisSize: MainAxisSize.min,
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      Icon(
                        Icons.qr_code_scanner,
                        color: Colors.white,
                      ),
                      SizedBox(
                        width: 10,
                      ),
                      Text(
                        "扫一扫",
                        style: TextStyle(color: Colors.white, fontSize: 16),
                      )
                    ],
                  ),
                  onTap: () {},
                )
              ];
            })
      ],
    );
  }
}
